<template>
  <div >
    <h1 align="center" style="margin:50px 0 80px 0">高管基本信息</h1>

  <el-table
    :data="tableData.filter(data =>
     (!searchname || data.name.toLowerCase().includes(searchname.toLowerCase()))
     && (!searchnum || data.num == (searchnum*1) )
     && (!searchzhi || data.date.toLowerCase().includes(searchdate.toLowerCase()))
     && (!searchsex || data.zheng.toLowerCase().includes(searchzheng.toLowerCase()))
     && (!searchedu || data.zhengnum.toLowerCase().includes(searchzhengnum.toLowerCase()))
    

      )"
    style="width: 100%">
   <el-table-column
      label="高管编号"
      prop="executiveCode">
    </el-table-column>
    <el-table-column
      label="高管名称"
      prop="executiveName">
    </el-table-column>
    <el-table-column
      label="职务"
      prop="executivePosition">
    </el-table-column>
    <el-table-column
      label="性别"
      prop="executiveGender">
    </el-table-column>
    <el-table-column
      label="学历"
      prop="eduBackground">
    </el-table-column>
   
    <el-table-column
      align="right">
      <template slot="header">
          <el-input
          v-model="searchnum"
          size="mini"
          placeholder="输入高管编号"/>
          <el-input
          v-model="searchname"
          size="mini"
          placeholder="输入高管名称"/>
           <el-input
          v-model="searchzhi"
          size="mini"
          placeholder="输入职务"/>
          <el-input
          v-model="searchsex"
          size="mini"
          placeholder="输入性别"/>
           <el-input
          v-model="searchedu"
          size="mini"
          placeholder="输入学历"/>
         
      </template>
      <template slot-scope="scope"  >
        
        <el-button
          size="mini"
          @click="handleEdit(scope.row.num)">修改</el-button>
          <el-button
          size="mini"
          type="danger"
          @click="handleEdit(scope.row.num)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>

   <div  style="margin:50px auto 50px auto ;width:fit-content">
      <el-button type="primary" @click="addtoppeople">新增高管</el-button>  
        <el-button type="primary" @click="returnIndex">返回企业列表</el-button>  
    </div>
    </div>
</template>

<script>

   import {toppeopleToShow} from '@/api/toppeople/index'
  
  
  export default {
   


    data() {
      return {
        tableData: [],
        searchnum: '',
        searchname: '',
        searchzhi: '',
         searchsex: '',
        searchedu: ''
      }
    },
    props:{
      companyCode :  {
        type: String,
        default: ""
      },
    },
    methods: {
       returnIndex(){
         this.$router.replace('/message')
       }, addtoppeople() {
        this.$router.push({
          path: '/toppeopleedit',
          query: {
            id:this.$route.query.id
          }
        })
      },
      handleEdit(row) {
         this.$router.push({
          path: '/toppeopleedit',
          query: {
            id: this.$route.query.id,
            idMessage:row
          }
        })
      },
      ShowToppeople(){
        toppeopleToShow(this.companyCode).then(res => {
           console.log(res)
           this.tableData = res
        }).catch((e) => {console.log(e )})
      },
    },
    mounted() {
      this.ShowToppeople()
    }
  }
</script>





   
 



